<template>
  <div>
    <a-layout>
      <a-layout-sider width="200" style="background: #fff;height:86vh">
        <a-menu
          mode="inline"
          :default-selected-keys="['/goods']"
          :style="{ height: '100%', borderRight: 0 }"
          @click="onClickChangeRouter"
        >
          <a-menu-item key="/goods">
            <a-icon type="laptop" />
            商品列表
          </a-menu-item>
          <a-menu-item key="/feilei">
            <a-icon type="laptop" />
            分类列表
          </a-menu-item>
        </a-menu>
      </a-layout-sider>
      <a-layout style="padding: 0 24px 24px">
        <a-breadcrumb style="margin: 16px 0">
          <a-breadcrumb-item>Home</a-breadcrumb-item>
          <a-breadcrumb-item>List</a-breadcrumb-item>
          <a-breadcrumb-item>App</a-breadcrumb-item>
        </a-breadcrumb>
        <a-layout-content
          :style="{
            background: '#fff',
            padding: '24px',
            margin: 0,
            minHeight: '280px',
          }"
        >
          <router-view></router-view>
        </a-layout-content>
      </a-layout>
    </a-layout>
  </div>
</template>
<script>
export default {
  methods: {
    onClickChangeRouter(path) {
      //点击切换
      // console.log(path);
      this.$router.push(path.key);
    },
  },
};
</script>
<style lang="scss" scoped>
</style>